import React, { PureComponent } from 'react'
import { Modal, Form, Input } from 'antd'
import PropTypes from 'prop-types'

// import Style from './changeScoreModal.css'

const { Item } = Form
const { TextArea } = Input

class changeScoreModal extends PureComponent {
  constructor (props) {
    super(props)
    this.state = {
    }
  }

  handelOk = () => {
    const { form, onOk } = this.props
    form.validateFields((err, values) => {
      if (!err) {
        onOk(values)
      }
    })
  }

  render () {
    const { visible, onCancel, form } = this.props
    const { getFieldDecorator } = form
    const formItemLayout = {
      labelCol: {
        xs: { span: 24 },
        sm: { span: 5 }
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 19 }
      }
    }
    return (
      <div>
        <Modal
          title='修改积分数值'
          onCancel={onCancel}
          onOk={this.handelOk}
          visible={visible}
        >
          <Form {...formItemLayout}>
            <Item label='积分'>
              {getFieldDecorator('residueIntegration', {
                rules: [
                  { required: true, message: '请输入积分' }
                ]
              })(<Input />)}
            </Item>
            <Item label='备注'>
              {getFieldDecorator('remark', {

              })(<TextArea />)}
            </Item>
          </Form>
        </Modal>
      </div>
    )
  }
}

changeScoreModal.propTypes = {
  visible: PropTypes.bool,
  onCancel: PropTypes.func,
  onOk: PropTypes.func,
  form: PropTypes.any
}
export default Form.create()(changeScoreModal)
